<template>
	<view class="order">
		<view class="main" v-if="moneyInfo">
			<view class="payMain">
				<image src="https://ydh5res.onlineweixin.com/cy2/bzinfo_files/paynav5n.png?v=1" alt="" class="payMainBg"
					style="pointer-events: none;"></image>
				<text class="username">姓名：{{ formInfo.name }}（{{formInfo.sex === 1 ? '男': '女'}}）</text>
				<view class="tips">
					今{{today}}希望是你改变自己的开始，最适合你的建议是......
					<text class="btn">【解锁后查看】</text>
				</view>
			</view>

			<view class="swiper-box">
				<swiper class="swiper" circular :vertical="true" :indicator-dots="false" :autoplay="true"
					:interval="2000" :duration="500" :disable-touch="true">
					<swiper-item v-for="(item,index) in userArr">
						<view class="flex align-center justify-center">
							<view class="img">
								<image mode="widthFix" :src="item.img"></image>
							</view>
							<view class="text-sm ">{{ item.name }} {{ item.timer }}分钟前测试 打 {{ item.fenshu }}
								分好评,对他的{{ item.typeStr }}带来了帮助！
							</view>
						</view>
					</swiper-item>
				</swiper>

			</view>

			<view class="pay-box">
				<view class="choose-box">
					<view class="choose-item" style="width: 100%;">
						<view class="flex align-center justify-between">
							<view class="item-title">服务内容</view>
						</view>
						<view class="flex align-center justify-between">
							<view class="item-text" style="display: flex; align-items: center;">
								超7000字专业提运报告 | 限时优惠
								<text id="num1">￥{{ moneyInfo ? Number(moneyInfo.priceData.config).toFixed(2) : '*' }}
								</text>
							</view>
							<view class="total">原价:￥{{
                  moneyInfo ? Number(moneyInfo.priceData.originalPrice).toFixed(2) : '*'
                }}
							</view>
						</view>
					</view>
				</view>
				<view class="money-text">
					已有
					<text>617627</text>
					人购买，
					<text>98%</text>
					的用户反馈报告对他们的
					<text>事业、感情和财富</text>
					给予了积极的帮助。
				</view>
				<!-- #ifdef MP-TOUTIAO || MP-ALIPAY -->
				<view style="width: 462rpx; height: 80rpx; margin: 20rpx auto 0;" @click="toReport">
					<image src="https://ydh5res.onlineweixin.com/cy2/bzinfo_files/zfb-a.jpg?v=1" mode="widthFix"
						style="width: 462rpx; height: 80rpx;"></image>
				</view>
				<!-- #endif -->
				<!-- #ifdef H5 -->
				<view style="width: 462rpx; height: 80rpx; margin: 20rpx auto 0;" @click="handleClickAliPay">
					<image src="https://ydh5res.onlineweixin.com/cy2/bzinfo_files/zfb-a.jpg?v=1" mode="widthFix"
						style="width: 462rpx; height: 80rpx;"></image>
				</view>
				<view style="width: 462rpx; height: 80rpx; margin: 20rpx auto 0;" @click="handleClickWxPay">
					<image src="https://yundao888.oss-cn-beijing.aliyuncs.com/cy2/bzinfo_files/wx.png?v=123" mode="widthFix"
						style="width: 462rpx; height: 80rpx;"></image>
				</view>
				<!-- #endif -->
			</view>
			<image src="https://ydh5res.onlineweixin.com/cy/bzinfo_files/tips.png" alt="" class="listTips">
			</image>
			<view class="payList" @click="showOrder">
				<view class="list">
					<image src="https://yundao888.oss-cn-beijing.aliyuncs.com/cy2/index_files/liangdakunhuo.png?v=101"
						alt="" mode="widthFix"></image>
				</view>
				<view class="list">
					<image src="https://ydh5res.onlineweixin.com/cy2/index_files/03@2xm-1.png?v=100" alt=""
						mode="widthFix" style="pointer-events: none;"></image>
				</view>
				<view class="list">
					<image src="https://ydh5res.onlineweixin.com/cy2/index_files/three@1m.png?v=100" alt=""
						mode="widthFix" style="pointer-events: none;"></image>
				</view>
				<view class="list">
					<image src="https://ydh5res.onlineweixin.com/cy2/index_files/four@1m.png?v=100" alt=""
						mode="widthFix" style="pointer-events: none;"></image>
				</view>
			</view>


			<view style="height: 140rpx;">
				<view class="scrollBtn" v-if="footerShow" @click="showOrder">
					<image src="https://ydh5res.onlineweixin.com/cy/bzinfo_files/btn4.png"></image>
				</view>
			</view>
		</view>

		<uni-popup ref="order" type="center" :is-mask-click="false">
			<view class="order-prop" v-if="moneyInfo">
				<view class="text-bold text-black text-lg margin-bottom-sm">心理建议订单信息</view>
				<view class="order-info" v-if="version === 'A1'">
					<view class="flex align-center justify-between margin-bottom-sm">
						<view class="text-red text-df">心理建议：
							<text
								class="text-bold">￥{{ moneyInfo ? Number(moneyInfo.priceData.config).toFixed(2) : '*' }}</text>
							元
						</view>
						<view class="old-money">原价 ￥{{
                moneyInfo ? Number(moneyInfo.priceData.originalPrice).toFixed(2) : '*'
              }}
						</view>
					</view>
					<view>大师级的报告已出，支付后即刻查看结果！</view>
				</view>

				<view class="order-info" v-if="version === 'B1' || version === 'C1' ">
					<view class="flex align-center justify-between margin-bottom-sm">
						<view class="text-red text-df">心理建议：
							<text class="text-bold">￥{{
                  formInfo.needExtraServe === 1 ? (moneyInfo.priceData.config * 1 + moneyInfo.priceData.teacherDiscountPrice * 1).toFixed(2) : (moneyInfo.priceData.config * 1).toFixed(2)
                }}
							</text>
							元
						</view>
						<view class="old-money">原价 ￥{{
                formInfo.needExtraServe === 1 ? (moneyInfo.priceData.originalPrice * 1 + moneyInfo.priceData.teacherOriginalPrice * 1).toFixed(2) : (moneyInfo.priceData.originalPrice * 1).toFixed(2)
              }}元
						</view>
					</view>
					<view>大师级的报告已出，支付后即刻查看结果！</view>
				</view>
				<view class="mainBtn flex align-center justify-around" @click="toReport">
					立即支付
				</view>

				<view class="close-btn" @click="hideOrder">
					<uni-icons type="clear" size="30" color="#666"></uni-icons>
				</view>
			</view>
		</uni-popup>
		<e-run-calendar ref="betterCalendarRef" :showCalendar="showCalendar" @confirm="selectDate" :isHourShow="true"
			@cancel="showCalendar = false" :selectOptions="selectOptionsArr"></e-run-calendar>
	</view>
</template>

<script>
	import {
		userList
	} from "../../tools/const";
	import {
		loaded,
		loading,
		toast,
		toPage
	} from "../../tools";
	import {
		getMoneyInfo,
		getOrderInfo,
		getType,
		payOrder,
		alipayOrder,
		submitInfo,
		h5AlipayOrder,
		h5WxpayOrder
	} from "../../api";
	import {
		APPID
	} from "../../config";
	import dayjs from "dayjs";
	import {
		calendar
	} from "../../components/better-calendar/calendar";

	export default {
		data() {
			const INIT_DAY_TYPE = "solar";
			const INIT_DAY_TIMESTAMP = dayjs().valueOf();
			const INIT_DAY = dayjs().format("YYYY-MM-DD");
			return {
				oid: '',
				totalNum: '*',
				userArr: [],
				userList: userList,
				footerShow: false,
				moneyInfo: null,
				Animal: '',
				submitBirthday: {},
				formInfo: {
					name: '',
					sex: '',
					birthday: '',
					birthday2: '',
					birthdayText: '',
					needExtraServe: 2, // 1:需要 2:不需要
					needExtraServeType: 0, // 0:不选  1:文字  2:语言
					customContent: '', // 自定义内容
					voice: '', // 语音
					voiceTime: 0, // 语音时长
					wechatNumber: '', // 预留的微信号
				},
				needExtraServe: 2,

				audioState: 0,
				playState: false,

				version: '',
				newTime: '10:00:00',
				timers: null,

				showCalendar: false,
				date: {
					type: INIT_DAY_TYPE, // 类型
					timestamp: INIT_DAY_TIMESTAMP, // 时间戳
					solarDate: INIT_DAY, // 公历日期 - 文本（2000-1-1）
					lunarDate: "", // 农历日期 - 文本（己卯年冬月廿五(2000-1-1)）
					lunarDateNumber: "", // 农历生日的数字写法（1999-12-25）
				},

				celenderValue: '', //选择值
				selectOptionsArr: [15, 0, 0, 0] //起始年份

			};
		},
		async onLoad(options) {
			this.oid = options.oid
			// #ifdef MP-ALIPAY || MP-TOUTIAO
			const data = await getType({
				appid: APPID
			})
			if (data.status === 200) {
				this.version = data.data.version
			}
			// #endif
		},
		onShow() {
			loading('加载中...')
			uni.getProvider({
				service: 'payment',
				success: function(res) {
					uni.setStorageSync('providerpayment', res.provider[0]);
				}
			});
			this.totalNum = ((new Date().getTime() / 100).toFixed(0).toString().slice(3, 9))
			this.getUserList()
			// #ifdef MP-ALIPAY || MP-TOUTIAO
			this.getMoneyInfo()
			// #endif
			// #ifdef H5
			this.getOrderDetail()
			// #endif
		},
		computed: {
			today() {
				const date = new Date()
				let year = date.getFullYear()
				let month = date.getMonth() + 1
				let dates = date.getDate()
				if (month >= 1 && month <= 9) {
					month = "0" + month
				}
				if (dates >= 0 && dates <= 9) {
					dates = "0" + dates
				}
				return `${year}年${month}月${dates}日`
			}
		},
		methods: {
			// h5端获取订单详情
			async getOrderDetail() {
				uni.showLoading({
					title: '加载中'
				})
				const res = await getOrderInfo({
					oid: this.oid
				})
				if (res.status === 200) {
					uni.hideLoading()
					this.moneyInfo = res.data
					this.formInfo = {

						name: res.data.dataMore.username,
						sex: Number(res.data.dataMore.gender),
						birthday: {
							year: res.data.birthdayJson ? JSON.parse(res.data.birthdayJson).yy : '',
							month: res.data.birthdayJson ? JSON.parse(res.data.birthdayJson).mm : '',
							day: res.data.birthdayJson ? JSON.parse(res.data.birthdayJson).dd : '',
						},
						birthday2: {
							year: res.data.birthdayJson ? JSON.parse(res.data.birthdayJson)._yy : '',
							month: res.data.birthdayJson ? JSON.parse(res.data.birthdayJson)._mm : '',
							day: res.data.birthdayJson ? JSON.parse(res.data.birthdayJson)._dd : '',
						},
						birthdayText: res.data.dataMore.lDate,
					}
					this.submitBirthday = res.data.birthdayJson ? JSON.parse(res.data.birthdayJson) : ''
					this.forMateTime()
				}
			},
			// 小程序端获取订单详情
			async getMoneyInfo() {
				let res = await getMoneyInfo({
					ac: 'getBaZeShowData',
					oid: this.oid,
				})
				if (res) {
					this.moneyInfo = res
					this.needExtraServe = res.needExtraServe ? Number(res.needExtraServe) : 2
					this.formInfo = {

						name: res.moreData.username,
						sex: Number(res.moreData.gender),
						birthday: {
							year: JSON.parse(res.birthdayJson).yy,
							month: JSON.parse(res.birthdayJson).mm,
							day: JSON.parse(res.birthdayJson).dd,
						},
						birthday2: {
							year: JSON.parse(res.birthdayJson)._yy,
							month: JSON.parse(res.birthdayJson)._mm,
							day: JSON.parse(res.birthdayJson)._dd,
						},
						birthdayText: res.moreData.lDate,
						// birthday: res.moreData.birthdayJson,
						needExtraServe: res.needExtraServe, // 1:需要 2:不需要
						needExtraServeType: res.needExtraServeType ? Number(res.needExtraServeType) :
						0, // 0:不选  1:文字  2:语言
						customContent: res.customContent, // 自定义内容
						voice: res.voice, // 语音
						voiceTime: res.voiceTime, // 语音时长
						wechatNumber: res.wechatNumber, // 预留的微信号
					}
					this.submitBirthday = JSON.parse(res.birthdayJson)
					this.forMateTime()
				}

				loaded()
			},
			forMateTime() {
				let remain = parseInt("");
				if (!remain) {
					remain = 59900;
				}
				remain = 59900;

				this.timers = setInterval(() => {
					this.initTimer(remain--);
				}, 10);


			},
			initTimer(total) {
				if (total / 100 >= 0) {
					let m = Math.floor((total / 100) / 60);
					let s = Math.ceil(((total / 100) % 3600) % 60);
					let ms = Math.ceil(total % 100)
					//  h = h < 10 ? ('0' + h) : h;
					m = m < 10 ? ('0' + m) : m;
					s = s < 10 ? ('0' + s) : s;
					ms = ms < 10 ? ('0' + ms) : ms;
					this.newTime = m + ':' + s + ':' + ms
				} else {
					clearInterval(this.timers)
					this.forMateTime()
				}
			},
			getUserList() {
				for (let i = 0; i < 10; i++) {
					let num = Math.floor(Math.random() * 60) + 1; //范围是[1~70]
					this.userList[num].timer = Math.floor(Math.random() * 10) + 1
					this.userList[num].fenshu = Math.floor(Math.random() * 10) + 90
					this.userList[num].typeStr = this.getRandomOption()
					this.userArr.push(this.userList[num])
				}
			},
			getRandomOption() {
				var options = ['事业', '爱情', '学业', '财运'];
				var index = Math.floor(Math.random() * options.length);
				return options[index];
			},
			onPageScroll(e) {
				if (e.scrollTop > 400) {
					this.footerShow = true
				} else {
					this.footerShow = false
				}
			},
			showOrder() {
				this.$refs.order.open()
			},
			hideOrder() {
				this.$refs.order.close()
			},
			editInfo() {
				this.formInfo.needExtraServe = 1
				this.$refs.info.open()
			},
			hideInfo() {
				this.getMoneyInfo()
				this.$refs.info.close()
			},
			async selectDate(e) {

				//  如果是公历
				if (e.type === "solar") {
					this.formInfo.birthday = {
						year: e.year,
						month: e.month,
						day: e.day,
					}
					this.formInfo.birthday2 = this.setSolarDate(Number(e.year), Number(e.month), Number(e.day))
					this.formInfo.birthdayText = e.text
					this.Animal = this.formInfo.birthday2.Animal
					this.submitBirthday = {
						yy: Number(this.formInfo.birthday2.cYear),
						mm: Number(this.formInfo.birthday2.cMonth),
						dd: Number(this.formInfo.birthday2.cDay),
						hh: e.hour,
						_dd: Number(this.formInfo.birthday2.lYear),
						_mm: Number(this.formInfo.birthday2.lMonth) * -1,
						_yy: Number(this.formInfo.birthday2.lDay)
					}
				}

				if (e.type === "lunar") {
					//  是农历
					this.formInfo.birthday = this.setLunarDate(Number(e.year), Number(e.month), Number(e.day), e
						.leap_month === 1)
					this.formInfo.birthday2 = {
						year: e.year,
						month: e.month,
						day: e.day,
					}
					this.formInfo.birthdayText = e.text
					this.Animal = this.formInfo.birthday.Animal

					this.submitBirthday = {
						yy: Number(this.formInfo.birthday.cYear),
						mm: Number(this.formInfo.birthday.cMonth),
						dd: Number(this.formInfo.birthday.cDay),
						hh: e.hour,
						_dd: Number(this.formInfo.birthday.lYear),
						_mm: Number(this.formInfo.birthday.lMonth) * -1,
						_yy: Number(this.formInfo.birthday.lDay)
					}
				}


				console.log(this.submitBirthday)
				this.noScroll = true;
				this.showCalendar = false;
			},
			setSolarDate(y, m, d) {
				const dt = calendar.solar2lunar(y, m, d);

				return dt;
			},
			setLunarDate(y, m, d, isLeapMonth) {
				const dt = calendar.lunar2solar(y, m, d, isLeapMonth);
				return dt;
			},
			checkForm(birthday2, username, sex) {

				//Ming Fix end

				var y = birthday2.yy;
				var m = birthday2.mm;
				var d = birthday2.dd * 1;

				var ys = y;
				var ms = m;
				var ds = d;

				var h = birthday2.hh * 1;

				var i = 0
				m = m - 1;
				d = d - 1;
				var sTermInfo = new Array(0, 21198, 42461, 63813, 85308, 106961, 128806, 150834, 173055, 195433, 217965,
					240558, 263215, 285853, 308440, 330912, 353245, 375400, 397371, 419149, 440750, 462193, 483513,
					504747);

				function wzc(year, num) {
					var objD = new Date((31556956000 * (year - 1882) + sTermInfo[num] * 60000) + Date.UTC(1882, 0, 5, 18,
						0));
					var hh = objD.getUTCHours();
					var mm = objD.getUTCMinutes();
					var ss = objD.getUTCSeconds();
					var s = num + '/(' + (objD.getUTCMonth() + 1) + "月" + objD.getUTCDate() + "日" + hh + ":" + mm + ')';
					return (s);
				}

				function sTerm_d(y, n) {
					var offDate = new Date((31556956000 * (y - 1882) + sTermInfo[n] * 60000) + Date.UTC(1882, 0, 5, 18,
						0));
					return (offDate.getUTCDate());
				}

				function sTerm_hi(y, n) {
					var offDate = new Date((31556956000 * (y - 1882) + sTermInfo[n] * 60000) + Date.UTC(1882, 0, 5, 18,
						0));
					var hi = offDate.getUTCHours() * 60 + offDate.getUTCMinutes();
					return (hi);
				}

				function sTerm_s(y, n) {
					var offDate = new Date((31556956000 * (y - 1882) + sTermInfo[n] * 60000) + Date.UTC(1882, 0, 5, 18,
						0));
					return (offDate);
				}

				var cY, cM, cD, cH;
				if (m < 2) cY = y - 1900 + 36 - 1;
				else cY = y - 1900 + 36;
				var term2 = sTerm_d(y, 2);
				if (m == 1 && (d + 1) > term2) cY = y - 1900 + 36;
				if (m == 1 && (d + 1) == term2 && (h * 60 + i) >= sTerm_hi(y, 2)) cY = y - 1900 + 36;
				var firstNode = sTerm_d(y, m * 2);
				cM = (y - 1900) * 12 + m + 12;
				var start_term = (Date.UTC(y, m, d + 1, h, i, 0, 0) - sTerm_s(y, m * 2 - 2)) / 1000;
				var start_term1 = wzc(y, m * 2 - 2);
				if (m == 0) {
					start_term = (Date.UTC(y, m, d + 1, h, i, 0, 0) - sTerm_s(y - 1, 22)) / 1000;
					start_term1 = wzc(y - 1, 22);
				}
				var end_term = (sTerm_s(y, m * 2) - Date.UTC(y, m, d + 1, h, i, 0)) / 1000;
				var end_term1 = wzc(y, m * 2);

				if ((d + 1) > firstNode || ((d + 1) == firstNode && (h * 60 + i * 1) >= sTerm_hi(y, m * 2))) {
					cM = (y - 1900) * 12 + m + 13;
					start_term = (Date.UTC(y, m, d + 1, h, i, 0, 0) - sTerm_s(y, m * 2)) / 1000;
					start_term1 = wzc(y, m * 2);
					end_term = (sTerm_s(y, m * 2 + 2) - Date.UTC(y, m, d + 1, h, i, 0)) / 1000;
					end_term1 = wzc(y, m * 2 + 2);
					if (m == 11) {
						end_term = (sTerm_s(y + 1, 0) - Date.UTC(y, m, d + 1, h, i, 0, 0)) / 1000;
						end_term1 = wzc(y + 1, 0);
					}
				}

				if (start_term < 0) start_term = 0;
				if (end_term < 0) end_term = 0;
				var dayCyclical = Date.UTC(y, m, 1, 0, 0, 0, 0) / 86400000 + 25567 + 10;
				cD = dayCyclical + d;
				if (h >= 23) cD = dayCyclical + d + 1;
				var nh;
				if (h == 23 || h == 1 || h == 3 || h == 5 || h == 7 || h == 9 || h == 11 || h == 13 || h == 15 || h ==
					17 || h == 19 || h == 21) {
					nh = h - 1;
					nh = nh + 2;
				} else {
					nh = h;
				}
				var houseCyclical = (Date.UTC(y, m, d + 1, nh, 0, 0, 0) / 3600000 + 25567 * 24) / 2;
				cH = houseCyclical;
				var lunarInfo = new Array(
					0x4bd8, 0x4ae0, 0xa570, 0x54d5, 0xd260, 0xd950, 0x5554, 0x56af, 0x9ad0, 0x55d2, 0x4ae0, 0xa5b6,
					0xa4d0, 0xd250, 0xd295, 0xb54f, 0xd6a0, 0xada2, 0x95b0, 0x4977, 0x497f, 0xa4b0, 0xb4b5, 0x6a50,
					0x6d40, 0xab54, 0x2b6f, 0x9570, 0x52f2, 0x4970, 0x6566, 0xd4a0, 0xea50, 0x6a95, 0x5adf, 0x2b60,
					0x86e3, 0x92ef, 0xc8d7, 0xc95f, 0xd4a0, 0xd8a6, 0xb55f, 0x56a0, 0xa5b4, 0x25df, 0x92d0, 0xd2b2,
					0xa950, 0xb557, 0x6ca0, 0xb550, 0x5355, 0x4daf, 0xa5b0, 0x4573, 0x52bf, 0xa9a8, 0xe950, 0x6aa0,
					0xaea6, 0xab50, 0x4b60, 0xaae4, 0xa570, 0x5260, 0xf263, 0xd950, 0x5b57, 0x56a0, 0x96d0, 0x4dd5,
					0x4ad0, 0xa4d0, 0xd4d4, 0xd250, 0xd558, 0xb540, 0xb6a0, 0x95a6, 0x95bf, 0x49b0, 0xa974, 0xa4b0,
					0xb27a, 0x6a50, 0x6d40, 0xaf46, 0xab60, 0x9570, 0x4af5, 0x4970, 0x64b0, 0x74a3, 0xea50, 0x6b58,
					0x5ac0, 0xab60, 0x96d5, 0x92e0, 0xc960, 0xd954, 0xd4a0, 0xda50, 0x7552, 0x56a0, 0xabb7, 0x25d0,
					0x92d0, 0xcab5, 0xa950, 0xb4a0, 0xbaa4, 0xad50, 0x55d9, 0x4ba0, 0xa5b0, 0x5176, 0x52bf, 0xa930,
					0x7954, 0x6aa0, 0xad50, 0x5b52, 0x4b60, 0xa6e6, 0xa4e0, 0xd260, 0xea65, 0xd530, 0x5aa0, 0x76a3,
					0x96d0, 0x4afb, 0x4ad0, 0xa4d0, 0xd0b6, 0xd25f, 0xd520, 0xdd45, 0xb5a0, 0x56d0, 0x55b2, 0x49b0,
					0xa577, 0xa4b0, 0xaa50, 0xb255, 0x6d2f, 0xada0, 0x4b63, 0x937f, 0x49f8, 0x4970, 0x64b0, 0x68a6,
					0xea5f, 0x6b20, 0xa6c4, 0xaaef, 0x92e0, 0xd2e3, 0xc960, 0xd557, 0xd4a0, 0xda50, 0x5d55, 0x56a0,
					0xa6d0, 0x55d4, 0x52d0, 0xa9b8, 0xa950, 0xb4a0, 0xb6a6, 0xad50, 0x55a0, 0xaba4, 0xa5b0, 0x52b0,
					0xb273, 0x6930, 0x7337, 0x6aa0, 0xad50, 0x4b55, 0x4b6f, 0xa570, 0x54e4, 0xd260, 0xe968, 0xd520,
					0xdaa0, 0x6aa6, 0x56df, 0x4ae0, 0xa9d4, 0xa4d0, 0xd150, 0xf252, 0xd520);
				var nStr1 = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十');
				var nStr2 = new Array('初', '十', '廿', '卅');
				var monthName = new Array("", "正", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二");

				function lYearDays(y) {
					var i, sum = 348;
					for (i = 0x8000; i > 0x8; i >>= 1) sum += (lunarInfo[y - 1900] & i) ? 1 : 0;
					return (sum + leapDays(y));
				}

				function leapDays(y) {
					if (leapMonth(y)) return ((lunarInfo[y - 1899] & 0xf) == 0xf ? 30 : 29);
					else return (0);
				}

				function leapMonth(y) {
					var lm = lunarInfo[y - 1900] & 0xf;
					return (lm == 0xf ? 0 : lm);
				}

				function monthDays(y, m) {
					return ((lunarInfo[y - 1900] & (0x10000 >> m)) ? 30 : 29);
				}


				function Lunar(objDate, hh) {
					var i, leap = 0,
						temp = 0;
					var offset = (Date.UTC(objDate.getFullYear(), objDate.getMonth(), objDate.getDate()) - Date.UTC(1900,
						0, 31)) / 86400000;
					if (objDate.getHours() >= 24) {
						offset++;
					}
					if (hh === -1) {
						offset++;
					}
					for (i = 1900; i < 2100 && offset > 0; i++) {
						temp = lYearDays(i);
						offset -= temp;
					}
					if (offset < 0) {
						offset += temp;
						i--;
					}
					this.year = i;
					leap = leapMonth(i);
					this.isLeap = false;
					for (i = 1; i < 13 && offset > 0; i++) {
						if (leap > 0 && i == (leap + 1) && this.isLeap == false) {
							--i;
							this.isLeap = true;
							temp = leapDays(this.year);
						} else {
							temp = monthDays(this.year, i);
						}
						if (this.isLeap == true && i == (leap + 1)) this.isLeap = false;
						offset -= temp;
					}
					if (offset == 0 && leap > 0 && i == leap + 1)
						if (this.isLeap) {
							this.isLeap = false;
						} else {
							this.isLeap = true;
							--i;
						}
					if (offset < 0) {
						offset += temp;
						--i;
					}
					this.month = i;
					this.day = offset + 1;
				}


				function cYear(y) {
					var s;
					s = nStr1[Math.floor(y / 1000)];
					s += nStr1[Math.floor((y % 1000) / 100)];
					s += nStr1[Math.floor((y % 100) / 10)];
					s += nStr1[y % 10];
					return (s);
				}

				function cDay(d) {
					var s;
					switch (d) {
						case 10:
							s = '初十';
							break;
						case 20:
							s = '二十';
							break;
							break;
						case 30:
							s = '三十';
							break;
							break;
						default:
							s = nStr2[Math.floor(d / 10)];
							s += nStr1[d % 10];
					}
					return (s);
				}

				function lll(y, m, i, h) {
					var hh = ["00:00-00:59早子", "01:00-01:59丑", "02:00-02:59丑", "03:00-03:59寅", "04:00-04:59寅",
						"05:00-05:59卯", "06:00-06:59卯", "07:00-07:59辰", "08:00-08:59辰", "09:00-09:59巳", "10:00-10:59巳",
						"11:00-11:59午", "12:00-12:59午", "13:00-13:59未", "14:00-14:59未", "15:00-15:59申", "16:00-16:59申",
						"17:00-17:59酉", "18:00-18:59酉", "19:00-19:59戌", "20:00-20:59戌", "21:00-21:59亥", "22:00-22:59亥",
						"23:00-23:59晚子"
					];
					var sDObj = new Date(y, m, i + 1, h);
					var lDObj = new Lunar(sDObj, h);
					var lY = cYear(lDObj.year);
					var lM = monthName[lDObj.month];
					var lD = cDay(lDObj.day);
					var lL = lDObj.isLeap ? '闰' : '';
					if (h >= 0 && h < 24) {
						var lS = hh[h];
					} else {
						var lS = '未知';
					}
					var lH = lDObj.isLeap ? '闰' : '';

					return (lY + '年' + lL + lM + '月' + lD + '日' + ' ' + lS + '时')
				}

				var lDate = lll(y, m, d, h);


				var _obj = {}
				_obj.username = username
				_obj.gender = sex
				_obj.y = ys;
				_obj.m = ms;
				_obj.d = ds;
				_obj.h = h;
				_obj.i = 0;
				_obj.cY = cY;
				_obj.cM = cM;
				_obj.cD = cD;
				_obj.cH = cH;
				_obj.term1 = wzc(y, m * 2);
				_obj.term2 = wzc(y, m * 2 + 1);
				_obj.start_term = start_term;
				_obj.end_term = end_term;
				_obj.start_term1 = start_term1;
				_obj.end_term1 = end_term1;
				_obj.lDate = lDate;

				return _obj

			},
			async saveInfo() {
				if (!this.formInfo.name) return toast('请输入姓名')
				if (!this.formInfo.sex) return toast('请选择性别')
				if (!this.formInfo.birthday) return toast('请选择生日')

				if (this.version === 'B1' || this.version === 'C1') {
					if (this.formInfo.needExtraServe === 1) {
						if (this.formInfo.needExtraServeType === 0) {
							return toast('请填写或录制问题诉求');
						}
						if (this.formInfo.needExtraServeType === 1 && !this.formInfo.customContent) {
							return toast('请填写问题诉求');
						}

						if (this.formInfo.needExtraServeType === 2 && !this.formInfo.voice) {
							return toast('请录制问题诉求');
						}

					}
				}


				let _dataOther = {
					oid: this.oid,
					birthdayJson: JSON.stringify(this.submitBirthday),
					needExtraServe: this.formInfo.needExtraServe,
					needExtraServeType: this.formInfo.needExtraServeType,
					customContent: this.formInfo.customContent,
					voice: this.formInfo.voice,
					voiceTime: this.formInfo.voiceTime,
					wechatNumber: '',


				}

				let _data = this.checkForm(this.submitBirthday, this.formInfo.name, this.formInfo.sex)
				loading('保存中...')
				const res = await submitInfo({
					..._data,
					..._dataOther
				})
				if (res.code === 200) {
					await this.getMoneyInfo()
					loaded()
					this.$refs.info.close()
				}

			},
			// 吊起抖音支付
			async handleDypayOrder() {
				let that = this
				const res = await payOrder({
					oid: that.oid,
				})
				if (res.status === 200) {
					let _data = JSON.parse(res.data)
					let that = this
					uni.requestPayment({
						provider: uni.getStorageSync('providerpayment'),
						orderInfo: _data.data,
						service: 5,
						success: (res) => {
							that.getOrderInfo()
						},
						fail: (e) => {
							that.getOrderInfo()
						}
					})
				}
			},
			// 吊起支付宝支付
			async handleZfbpayOrder() {
				uni.showLoading({
					title: '加载中'
				})
				const res = await alipayOrder({
					oid: this.oid,
				})
				if (res.status === 200) {
					uni.hideLoading()
					uni.requestPayment({
						provider: 'alipay',
						orderInfo: res.data.trade_no,
						success: (res) => {
							this.getOrderInfo()
						},
						fail: (e) => {
							this.getOrderInfo()
						}
					})
				}
			},
			// h5端支付宝支付接口
			async handleClickAliPay() {
				const res = await h5AlipayOrder(this.oid)
				document.write(res)
			},
			// h5端微信支付接口
			async handleClickWxPay() {
				const res = await h5WxpayOrder(this.oid)
				document.write(res)
			},
			// 点击立即支付操作
			async toReport() {
				// #ifdef MP-TOUTIAO
				this.handleDypayOrder()
				// #endif
				// #ifdef MP-ALIPAY
				this.handleZfbpayOrder()
				// #endif
				// #ifdef H5
				this.handleClickAliPay()
				// #endif
			},
			async getOrderInfo() {
				const res = await getOrderInfo({
					oid: this.oid,
				})
				if (res.data.status === 1) {
					toPage(`/pages/report/report?oid=${this.oid}`)
				} else {
					toast('支付失败，请重试！')
					// toPage(`/pages/report/report?oid=${this.oid}`)
				}
			},
			startAudio() {
				this.formInfo.voice = ''
				this.formInfo.voiceTime = 0
				this.audioState = 1
				this.recorderManager.start({
					format: 'wav'
				});
				// this.voiceTimer = setInterval(() => {
				//   this.formInfo.voiceTime += 1
				// }, 1000)
			},
			endRecord() {
				this.audioState = 2
				// clearInterval(this.voiceTimer)
				this.recorderManager.stop()


			},
			playVoice() {
				if (!this.playState) {
					console.log(this.formInfo.voice)
					if (this.formInfo.voice) {
						this.innerAudioContext.src = this.formInfo.voice;
						this.innerAudioContext.play()
					}
				} else {
					this.playState = false
					this.innerAudioContext.stop()
				}

			}
		},
		watch: {
			'formInfo.needExtraServe'() {
				if (this.formInfo.needExtraServe === 2) {
					this.formInfo.needExtraServeType = 0
					this.formInfo.customContent = ''
					this.formInfo.voice = ''
					this.formInfo.voiceTime = 0
					this.formInfo.wechatNumber = ''
					this.audioState = 0
					this.playState = false
					//  执行方法 停止录音
					//  执行方法 播放
				}
			},
			'formInfo.needExtraServeType'() {
				this.formInfo.customContent = ''
				this.formInfo.voice = ''
				this.formInfo.voiceTime = 0
				this.formInfo.wechatNumber = ''
				this.audioState = 0
				this.playState = false
				//  执行方法 停止录音
				//  执行方法 播放
			}
		}
	}
</script>

<style lang="scss">
	.order {
		width: 100%;
		min-height: 100vh;
		overflow-x: hidden;

		.main {
			width: 100%;
			height: 100%;
			position: relative;
			overflow: hidden;

			.payMain {
				width: 100%;
				position: relative;

				.payMainBg {
					width: 750rpx;
					height: 725rpx;
				}

				.username {
					position: absolute;
					top: 176rpx;
					left: 130rpx;
					color: #fff;
				}

				.tips {
					position: absolute;
					width: 536rpx;
					top: 220rpx;
					left: 130rpx;
					line-height: 50rpx;
					color: #fff;

					.btn {
						color: #0099cc
					}
				}
			}

			.swiper-box {

				display: flex;
				align-items: center;
				justify-content: space-between;
				width: 100%;
				height: 40rpx;
				padding: 0 30rpx;
				box-sizing: border-box;
				position: relative;
				top: -20rpx;

				.swiper {
					width: 100%;
					height: 40rpx;
					color: #81b3ff;
					box-sizing: border-box;

					.img {
						width: 40rpx;
						height: 40rpx;
						border-radius: 20rpx;
						margin-right: 20rpx;

						image {
							width: 40rpx;
							height: 40rpx;
							border-radius: 20rpx;
						}
					}
				}

			}


			.pay-box {
				width: 690rpx;
				margin: 0 auto;
				padding: 30rpx;
				background: #d1eaff;
				border-radius: 20rpx;
				box-sizing: border-box;

				.choose-box {
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 20rpx;

					.choose-item {
						padding: 20rpx 15rpx;
						box-sizing: border-box;
						background: #fff;
						border-radius: 20rpx;
						border: 5rpx solid #ff002a;
						position: relative;

						.item-title {
							font-size: 30rpx;
							line-height: 150%;
							color: #ff002a;
							margin-bottom: 10rpx;
							margin-top: 10rpx;
						}

						.newTime-box {
							width: 60%;

							.newTime {
								font-size: 32rpx;
								font-weight: bold;
								color: rgb(255, 0, 42);
								margin-left: 10rpx;
							}
						}

						.item-text {
							flex: 1;
							font-size: 22rpx;
							color: #ff002a;

							text {
								margin-left: 8rpx;
								font-size: 30rpx;
								font-weight: bold;
							}
						}

						.total {
							font-size: 20rpx;
							line-height: 150%;
							color: #999;
							text-decoration: line-through;
						}
					}
				}

				.money-text {
					font-size: 28rpx;
					text-align: justify;

					text {
						font-size: 28rpx;
						font-weight: bold;
						color: #ff002a;
						margin-left: 10rpx;
						margin-right: 10rpx;
						line-height: 130%;
					}
				}

				.mainBtn {

					width: 500rpx;
					height: 70rpx;
					background: #26639d;
					color: #fff;
					border-radius: 20rpx;
					margin: 20rpx auto 0;
				}
			}

			.pay-box2 {
				width: 690rpx;
				margin: 0 auto;
				padding: 30rpx;
				background: #d1eaff;
				border-radius: 20rpx;
				box-sizing: border-box;

				.choose-box {
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 20rpx;

					.choose-item {
						padding: 20rpx 15rpx;
						box-sizing: border-box;
						background: #fff;
						border-radius: 20rpx;
						border: 5rpx solid #ff002a;
						position: relative;

						&.active {
							border: 5rpx solid #ccc;

							.item-label {
								background: #ccc;
							}

							.item-title {
								color: #ccc;
							}

							.item-text {
								color: #ccc;
							}
						}

						.item-label {
							position: absolute;
							top: -20rpx;
							right: -4rpx;
							display: flex;
							align-items: center;
							justify-content: center;
							font-size: 22rpx;
							width: max-content;
							height: 40rpx;
							padding: 0 20rpx;
							border-radius: 20rpx 20rpx 0 20rpx;
							background: #ff002a;
							color: #fff;
						}

						.item-title {
							font-size: 30rpx;
							line-height: 150%;
							color: #ff002a;
							margin-bottom: 10rpx;
							margin-top: 10rpx;
						}

						.newTime-box {
							width: 60%;

							.newTime {
								font-size: 32rpx;
								font-weight: bold;
								color: rgb(255, 0, 42);
								margin-left: 10rpx;
							}
						}

						.item-text {
							font-size: 22rpx;
							white-space: nowrap;
							color: #ff002a;

							text {
								margin-left: 10rpx;
							}
						}


					}
				}

				.money-box {
					.total {
						font-size: 26rpx;
						line-height: 150%;
						color: #999;
						text-decoration: line-through;
					}

					.now-money {
						font-size: 30rpx;

						.newMoney {
							font-size: 32rpx;
							font-weight: bold;
							color: rgb(255, 0, 42);
							margin-left: 10rpx;
						}

						.newTime {
							font-size: 32rpx;
							color: rgb(255, 0, 42);
							margin-left: 10rpx;
						}
					}
				}

				.money-text {
					font-size: 28rpx;
					text-align: justify;

					text {
						font-size: 28rpx;
						font-weight: bold;
						color: #ff002a;
						margin-left: 10rpx;
						margin-right: 10rpx;
						line-height: 130%;
					}
				}

				.mainBtn {

					width: 500rpx;
					height: 70rpx;
					background: #26639d;
					color: #fff;
					border-radius: 20rpx;
					margin: 20rpx auto 0;
				}
			}


			.listTips {
				width: 750rpx;
				height: 65rpx;
				margin-top: 50rpx;
			}

			.payList {
				.list {
					width: 100%;
					height: auto;
					position: relative;

					image {
						width: 750rpx;
					}
				}
			}

		}

		.scrollBtn {
			display: flex;
			align-items: center;
			justify-content: center;
			background-color: rgba(172, 188, 210, 0.6);
			width: 750rpx;
			height: 140rpx;
			position: fixed;
			bottom: 0;
			left: 0;

			image {
				width: 673rpx;
				height: 114rpx;

				animation: big 2s linear infinite;
			}
		}

		.order-prop {
			background: #fff;
			padding: 30rpx;
			width: 690rpx;
			box-sizing: border-box;
			position: relative;

			.order-info {
				border: 4rpx solid #f00;
				margin-bottom: 20rpx;
				padding: 20rpx;
				box-sizing: border-box;
				width: 100%;

				.old-money {
					text-decoration: line-through;
					color: #999;
					font-size: 28rpx;
				}

			}

			.mainBtn {

				width: 500rpx;
				height: 70rpx;
				background: #26639d;
				color: #fff;
				border-radius: 20rpx;
				margin: 40rpx auto 0;
			}

			.close-btn {
				position: absolute;

				right: 0;
				top: -20rpx;
				z-index: 999;
				width: 40rpx;
				height: 40rpx;
			}
		}

		.birth-box {
			position: absolute;
			top: 50%;
			left: 50%;

			transform: translate(-50%, -50%);
			width: 705rpx;
			height: 671rpx;
			color: #26639d;
			font-size: 28rpx;

			&.active {
				height: 935rpx;
			}

			.bg {
				width: 705rpx;
				position: absolute;
				top: 0;
				left: 0;

				&.bg1 {
					height: 936rpx;
				}

				&.bg2 {
					height: 671rpx;
				}
			}


			.form-name {
				position: absolute;
				left: 200rpx;
				top: 115rpx;
				width: 400rpx;
				height: 80rpx;
				z-index: 19;

				input {
					display: block;
					width: 500rpx;
					height: 80rpx;
					padding: 0 30rpx;
					box-sizing: border-box;
					font-size: 28rpx;
				}
			}

			.form-sex {
				position: absolute;
				left: 200rpx;
				top: 215rpx;
				width: 400rpx;
				height: 80rpx;
				z-index: 19;

				.sex-item {
					display: flex;
					align-items: center;
					justify-content: center;
					height: 56rpx;
					width: 146rpx;
					box-sizing: border-box;
					text-align: center;
					line-height: 56rpx;
					border-radius: 28rpx;
					color: #fff;
					background: #b2c6dc;

					&.active {
						background: #ff9d33;
					}

					image {
						width: 30rpx;
						margin-right: 15rpx;
					}
				}

			}

			.form-birthday {
				position: absolute;
				left: 200rpx;
				top: 312rpx;
				width: 400rpx;
				height: 80rpx;
				z-index: 19;

				input {
					display: block;
					width: 500rpx;
					height: 80rpx;
					padding: 0 30rpx;
					box-sizing: border-box;
					font-size: 28rpx;
				}
			}

			.needJh {
				position: absolute;
				top: 390rpx;
				left: 0;
				width: 100%;
				height: 100rpx;
				display: flex;
				align-items: center;
				justify-content: center;

				.title {


					font-size: 30rpx;
					margin-right: 40rpx;
				}

				.chooseSlider {
					width: 280rpx;
					height: 40rpx;
					border-radius: 30rpx;
					background: #b2c6dc;
					position: relative;

					view {
						position: absolute;
						left: 0;
						top: -10rpx;
						width: 180rpx;
						height: 60rpx;
						border-radius: 30rpx;
						border: 4rpx solid #fff;
						transition: .3s linear all;
						box-sizing: border-box;

						&.active {
							left: 100rpx;

							text {
								color: #fff;
								border: 10rpx solid #163d64;
								background: #163d64;
							}
						}

						text {
							display: flex;
							align-items: center;
							justify-content: center;
							width: 100%;
							height: 100%;
							background: #b2c6dc;
							border-radius: 30rpx;
							border: 10rpx solid #97b4d4;
							color: #fff;
							box-sizing: border-box;
						}
					}
				}
			}

			.title-btn {
				position: absolute;
				top: 530rpx;
				left: 50%;
				transform: translate(-50%, 0);
				display: block;
				width: 320rpx;
				height: 45rpx;
			}

			.desc-btn-list {
				position: absolute;
				top: 610rpx;
				left: 60rpx;
				right: 60rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.desc-btn {
					display: block;
					width: 314rpx;
					height: 136rpx;
				}
			}

			.desc-text {
				display: block;
				position: absolute;
				top: 500rpx;
				left: 30rpx;
				right: 30rpx;

				.desc-title {
					font-size: 21rpx;
					line-height: 150%;
					color: #65768b;
					text-align: center;
					margin-bottom: 20rpx;
				}

				.text-info {
					display: flex;
					align-items: flex-end;
					justify-content: space-between;
					flex-direction: column;
					width: 100%;
					height: 250rpx;
					padding: 20rpx;
					border-radius: 20rpx;
					background: #fff;
					box-sizing: border-box;

					.back-btn {
						display: block;
						width: 64rpx;
						height: 41rpx;
					}

					textarea {
						display: block;
						width: 100%;
						height: 160rpx;
						border: 0;
						font-size: 26rpx;
						line-height: 150%;
						color: #26639d;
						box-sizing: border-box;
					}
				}
			}

			.desc-audio {
				display: block;
				position: absolute;
				top: 500rpx;
				left: 30rpx;
				right: 30rpx;

				.desc-title {
					font-size: 21rpx;
					line-height: 150%;
					color: #65768b;
					text-align: center;
					margin-bottom: 20rpx;
				}

				.text-info {
					display: flex;
					align-items: flex-end;
					justify-content: space-between;
					flex-direction: column;
					width: 100%;
					height: 250rpx;
					padding: 20rpx;
					border-radius: 20rpx;
					background: #fff;
					box-sizing: border-box;

					.back-btn {
						display: block;
						width: 64rpx;
						height: 41rpx;
					}

					.play-audio {
						display: flex;
						align-items: center;
						justify-content: space-between;
						padding: 15rpx 20rpx;
						background: #26639d;
						border-radius: 10rpx;

						.audio-play {
							width: 35rpx;
							height: 35rpx;
							display: block;
							margin-right: 20rpx;
						}

						.audio-gif {
							width: 120rpx;
							height: 35rpx;
							display: block;
							margin-right: 20rpx;
						}

						.audio-png {
							width: 120rpx;
							height: 35rpx;
							display: block;
							margin-right: 20rpx;
						}

						text {
							font-size: 26rpx;
							line-height: 35rpx;
							color: #fff;
						}
					}

					.star-box {
						width: 100%;
						display: flex;
						align-items: center;
						justify-content: space-around;
						flex-direction: column;

						image {
							display: block;
							width: 100rpx;
							height: 100rpx;
							margin: 0 auto 30rpx;
						}

						view {
							font-size: 26rpx;
							line-height: 35rpx;
						}
					}

					.ing-box {
						width: 100%;
						display: flex;
						align-items: center;
						justify-content: space-around;
						flex-direction: column;

						image {

							display: block;
							width: 205rpx;
							height: 90rpx;
							margin: 0 auto 30rpx;
						}

						view {
							font-size: 26rpx;
							line-height: 35rpx;
						}
					}

					.end-box {
						width: 100%;
						display: flex;
						align-items: center;
						justify-content: space-around;
						flex-direction: column;

						image {
							display: block;
							width: 50rpx;
							height: 50rpx;
							margin: 0 auto 10rpx;
						}

						view {
							font-size: 26rpx;
							line-height: 35rpx;
						}
					}
				}
			}


			.btn-edit {
				position: absolute;
				left: 0;
				bottom: 20rpx;
				display: flex;
				align-items: center;
				justify-content: space-around;
				width: 705rpx;
				height: 114rpx;
				box-sizing: border-box;

				image {
					width: 504rpx;
					height: 86rpx;
					margin: 0 auto;
					animation: big 2s linear infinite;
				}
			}

			.close-btn {
				position: absolute;
				left: 0;
				bottom: -100rpx;
				display: flex;
				align-items: center;
				justify-content: space-around;
				width: 705rpx;
			}

		}
	}
</style>